<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport"
          content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>我的案例详情</title>
    <link rel="stylesheet" type="text/css" href="../css/public-style.css"/>
    <link rel="stylesheet" type="text/css" href="../css/caseDetails.css"/>
</head>
<body>
<!-- 内容 -->
<div id="main">
    <!-- 头部 -->
    <header>
        <img src="../image/return.png" id="fanHui"/>
        <span id="tilte">案例详情</span>
    </header>

    <!-- 导航 -->
    <div class="nav bg">
        <div class="act">案件详情</div>
        <div>案件留言</div>
        <div>案件处理</div>
    </div>

    <!-- 内容 -->
    <div class="content content_1" style="display: block">
        <div class="caseImg bg">
            <div class="title">案例图片</div>
            <!-- ------------------轮播图---------------------- -->
            <div class="cycle_img">
                <div class="flicker-example" data-block-text="false">
                    <ul>
                        <li data-background="../img/field.jpg"></li>
                        <li data-background="../img/forest.jpg"></li>
                        <li data-background="../img/frozen-water.jpg"></li>
                    </ul>
                </div>
            </div>
        </div>

        <div class="place bg">
            <div class="title">位置描述</div>
            <div class="describe">
                位置描述位置描述位置描述位置描述位置描述位置描述位置描述位置描述位置描述
                位置描述位置描述位置描述位置描述位置描述位置描述位置描述位置描述位置描述
            </div>
        </div>

        <div class="contact bg">
            <div class="title">联系电话</div>
            <div class="describe">
                +86 12233344444
            </div>
        </div>

        <div class="geography bg">
            <div class="title">联系电话</div>
            <div class="describe">
                <img src="../image/ceshi.png"/>
            </div>
        </div>
    </div>


    <!-- 内容 -->
    <div class="content content_2">
        <div class="info">
            <p>2016年03月23日 17:33:43</p>

            <div class="news">
                <div class="portrait"><img src="../image/ceshi.png"/></div>
                <div class="message bg">
                    <div class="bg"></div>
                    位置描述位置描述位置描述位置描述位置 述位置描述位置描述位置描述位。
                    位置描述位置描述位置描述位置描述位置 述位置描述位置描述位置描述位。
                </div>
            </div>
        </div>
        <div class="info my">
            <p>2016年03月23日 17:33:43</p>

            <div class="news">
                <div class="message bg">
                    <div class="bg"></div>
                    位置描述位置描述位置描述位置描述位置 述位置描述位置描述位置描述位。
                    位置描述位置描述位置描述位置描述位置 述位置描述位置描述位置描述位。
                    位置描述位置描述位置描述位置描述位置 述位置描述位置描述位置描述位。
                    位置描述位置描述位置描述位置描述位置 述位置描述位置描述位置描述位。
                </div>
                <div class="portrait"><img src="../image/ceshi.png"/></div>
            </div>
        </div>

        <div class="reply">
            回复留言
        </div>

        <div class="submit">
            <div class="entry">
                留言
                <div class="close"><img src="../image/X.png"/></div>
                <textarea></textarea>
            </div>
            <div class="tj">提交</div>
        </div>
    </div>

    <!-- 内容 -->
    <div class="content content_3"></div>
</div>
<div class="ul">
    <div class="li">完成案件</div>
    <div class="li">上报案件</div>
    <div class="li">作废案件</div>
    <div class="li">分派案件</div>
    <div class="arrow"></div>
</div>
</body>
<script src="../js/remJs.js"></script>
<script src="../js/jquery-1.8.0.min.js"></script>
<!--Required libraries-->
<script src="../js/jquery-v1.10.2.min.js" type="text/javascript"></script>
<script src="../js/modernizr-custom-v2.7.1.min.js" type="text/javascript"></script>
<script src="../js/jquery-finger-v0.1.0.min.js" type="text/javascript"></script>
<!--Include flickerplate-->
<link href="../css/flickerplate.css" type="text/css" rel="stylesheet">
<script src="../js/flickerplate.min.js" type="text/javascript"></script>
<!--Execute flickerplate-->
<script>
    $(document).ready(function () {
        $('.flicker-example').flicker();
        //导航
        $('.nav>div').click(function () {
            var idx = $(this).index() + 1;
            if (idx == 3) {
                $('.ul').toggle();
                return false;
            }
            $('.ul').hide();
            $('.nav .act').removeClass('act');
            $(this).addClass('act');
            $('#tilte').html($(this).html());

            $('.content').hide();
            $('.content_' + idx).show();

        })

        //回复
        msgReply(function (val) {
            alert(val)
        })
    });

</script>
</html>